import nanoid from "@/lib/nanoid";
import { onMounted, ref } from "vue";
import type { Ref } from "vue";
import axios from "axios";
import { getSeckillList, getProList } from "@/api/api";
import { Toast } from "vant";
import { useRouter } from "vue-router";

interface IBannerItem {
    alt: string;
    bannerid: string;
    flag: boolean;
    img: string;
    link: string;
}

interface ICountDownContent {
    content: string;
    time: string;
}

interface ISeckillItem {
    img1: string;
    originprice: number;
    proid: string;
    proname: string;
}
interface IAPISeckill {
    code: string;
    data: ISeckillItem[];
    message: string;
}

// 轮播图区域
export const useSwiper = () => {
    const bannerList: Ref<IBannerItem[]> = ref([]);

    const mockBannerList = async () => {
        const res = await axios.get("http://121.89.205.189:3000/api/banner/list");
        if (res.data.code === "200") {
            bannerList.value = res.data.data;
        }
    };

    onMounted(() => {
        mockBannerList();
    });

    return {
        bannerList,
    };
};

// 宫格区域
export const useGridList = () => {
    const gridList = ref([
        {
            id: nanoid(),
            text: "京东超市",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/175540/24/19329/6842/60ec0b0aEf35f7384/ec560dbf9b82b90b.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "数码电器",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东新百货",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/54043/33/19389/4660/62b049dbE3b9aef75/2fcd31afd5d702e4.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东生鲜",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/177902/16/13776/5658/60ec0e71E801087f2/a0d5a68bf1461e6d.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东到家",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/196472/7/12807/7127/60ec0ea3Efe11835b/37c65625d94cae75.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东超市",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/175540/24/19329/6842/60ec0b0aEf35f7384/ec560dbf9b82b90b.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "数码电器",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东新百货",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/54043/33/19389/4660/62b049dbE3b9aef75/2fcd31afd5d702e4.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东生鲜",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/177902/16/13776/5658/60ec0e71E801087f2/a0d5a68bf1461e6d.png!q70.jpg",
        },
        {
            id: nanoid(),
            text: "京东到家",
            url: "https://m15.360buyimg.com/mobilecms/jfs/t1/196472/7/12807/7127/60ec0ea3Efe11835b/37c65625d94cae75.png!q70.jpg",
        },
    ]);

    return {
        gridList,
    };
};

// 秒杀区域
export const useSeckillList = () => {
    const countDown: Ref<number> = ref(3600 * 1000);
    const countDownContent: Ref<ICountDownContent> = ref({
        content: "v我50秒杀",
        time: "12点场",
    });
    const apiSeckillList: Ref<ISeckillItem[]> = ref([]);
    const seckillList = async () => {
        const res = (await getSeckillList({ count: 1 })) as unknown as IAPISeckill;
        if (res.code === "200") {
            apiSeckillList.value = res.data;
        } else {
            Toast.success(res.message);
        }
    };

    onMounted(() => {
        seckillList();
    });

    return {
        countDown,
        countDownContent,
        apiSeckillList,
    };
};

// 商品列表区域
export const useProductList = () => {
    const loading = ref(false);
    const finished = ref(false);
    const router = useRouter();
    const productList: Ref<ISeckillItem[]> = ref([]);
    const count: Ref<number> = ref(1);
    const refreshLoading = ref(false);
    const APIGetproList = async () => {
        const res = (await getProList({
            count: count.value,
        })) as unknown as IAPISeckill;
        if (res.code === "200") {
            productList.value = res.data;
        }
    };

    // 上拉加载
    const onLoad = () => {
        loading.value = true;
        count.value += 1;
        getProList({ count: count.value }).then((res) => {
            loading.value = false;
            if (res.data.length === 0) {
                finished.value = false;
                return false;
            }
            productList.value = productList.value.concat(res.data);
        });
    };

    // 下拉刷新
    const onRefresh = () => {
        count.value = 1;
        productList.value = [];
        APIGetproList();
        refreshLoading.value = false;
    };

    const goToDetail = (id: string) => {
        router.push({
            path: "/detail",
            query: {
                id,
            },
        });
    };

    onMounted(() => {
        APIGetproList();
    });

    return {
        refreshLoading,
        onRefresh,
        loading,
        finished,
        onLoad,
        productList,
        goToDetail,
    };
};
